// 管理路由的文件
import Vue from 'vue';
import VueRouter from 'vue-router'
// 使用中间件
Vue.use(VueRouter)

// 引入组件
import index from '../page/index.vue'
import cart from '../page/cart.vue'
import cate from '../page/cate.vue'
import my from '../page/my.vue'
import layout from '../components/layout.vue'
// 父组件中通过路由的方式嵌套子组件，所以叫嵌套路由

const router = new VueRouter({
  // 路由表
  routes: [
    {
      path: '/layout',
      component: layout,
      // 子路由
      children: [
        {path: 'index', component: index, meta: {title: '首页'}},
        {path: 'cart', component: cart, meta: {title: '购物车'}},
        {path: 'cate', component: cate, meta: {title: '分类'}},
        {path: 'my', component: my, meta: {title: '我的'}},
      ]
    },
      // {
      //   path: '/first',
      //   component: first
      // },
    // {
    //   path: '/index',
    //   component: index
    // },
    // {
    //   path: '/cart',
    //   component: cart
    // },
    // {
    //   path: '/cate',
    //   component: cate
    // },
    // {
    //   path: '/my',
    //   component: my
    // },
    {
      path: '*',
      redirect: '/layout/index'
    }
  ]
});

// 处理NavigationDuplicated: Avoided redundant navigation to current location报错
// 报错原因是路由重复，处理的原理是捕获错误
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
  return originalPush.call(this, location).catch(err => err)
}
export default router